.clstecconv-controls,
.clstecconv-left {
    position: relative;
    height: 100%
}

.clstecconv-left {
    float: left;
    width: 40%;
    left: 0;
    top: 0;
    text-align: center;
    box-sizing: border-box;
    padding-left: 0
}

.clstecconv-right {
    height: 100%;
    width: 60%;
    text-align: right;
    float: right;
    padding-right: 20px;
    box-sizing: border-box
}

.clstecconv-left .clstecconv-param_a {
    position: relative;
    margin-left: 30px;
    margin-right: 16px
}

.clstecconv-param_steps {
    margin-top: 30px;
    margin-left: 16px;
    height: 300px
}

.clstecconv-table_row.clstecconv-table_header {
    text-align: center
}

.clstecconv-table_row:not(:first-of-type) {
    border-top: 1px solid #999
}

.clstecconv-table_cell {
    display: inline-block;
    width: 50%;
    height: 100%;
    box-sizing: border-box;
    overflow: hidden;
    padding: 1px
}

.clstecconv-table_cell:not(:last-of-type) {
    border-right: 1px solid #999
}

.clstecconv-animation {
    position: absolute;
    bottom: 0;
    right: 0;
    left: 76px
}

.clstecconv-animation_button {
    display: inline-block;
    margin-bottom: 5px;
    width: 100%
}

.clstecconv-function {
    text-align: right;
    margin-bottom: 5px
}

.clstecconv-combobox {
    display: inline-block;
    width: 100%;
    text-align: left
}

.clstecconv-zoom {
    display: inline-block;
    width: 60%;
    text-align: left;
    padding-left: 45px;
    box-sizing: border-box
}

.clstecconv-zoom_label {
    display: inline-block;
    width: 40%;
    text-align: left
}

.clstecconv-zoom_value {
    display: inline-block;
    width: 60%;
    text-align: left
}

.clstecconv-zoom_buttons {
    display: inline-block;
    width: 40%;
    text-align: right
}

.clstecconv-zoom_button {
    width: 25%;
    margin-left: 5px
}

.clstecconv-slider_group {
    right: 11px;
    padding-top: 20px
}

.clstecconv-graph {
    height: 170px;
    border-radius: 0;
    width: 250px;
    -webkit-border-radius: 0;
    margin-left: 45px
}

.clstecconv-graph_container {
    position: relative;
    height: 60%;
    padding-top: 23px;
    box-sizing: border-box
}

.clstecconv-area_container {
    position: relative;
    height: 40%
}

.cg-clstecconv-vertical {
    height: 100%;
    max-height: 200px
}

.clstecconv-hidden {
    display: none
}

.clstecconv-slider_label {
    position: relative;
    float: left;
    left: -20px;
    top: 24px
}

.clstecconv-slider_value {
    position: relative;
    float: right;
    top: -24px;
    right: -36px;
    font-size: 14px;
    text-align: left;
    width: 27px
}

.cg-clstecconv-vertical .clstecconv-slider_label {
    text-align: center;
    top: 25px;
    left: 12px
}

.cg-clstecconv-vertical .clstecconv-slider_value {
    text-align: center;
    top: -4px;
    right: 0
}

.cl2d-board_with_outside_axises-board {
    box-sizing: border-box
}

.center-aligned {
    display: block;
    text-align: center
}

.cg-clstecconv-accordioncontent h3 {
    font-size: 11pt
}

.Screen {
    height: 100%
}

.Screen__left {
    display: inline-block;
    vertical-align: top;
    width: 260px;
    height: 100%;
    font-size: 15px
}

.Screen__combobox {
    width: 270px;
    margin: 0 auto;
    font-size: 15px
}

.Screen__buttons {
    text-align: center
}

.Screen__buttons-item {
    width: 190px;
    margin-top: 10px
}

.Screen__middle,
.Screen__right {
    display: inline-block;
    vertical-align: top;
    height: 100%
}

.Screen__right {
    width: 280px;
    font-size: 15px
}

.Controller1Bottom__slider {
    position: relative;
    height: 30px;
    margin-bottom: 10px;
    width: 39%;
    float: right;
    clear: right;
    padding-right: 11px
}

.Controller1Bottom__slider-label {
    position: absolute;
    top: 0;
    left: 10px
}

.Controller1Bottom__slider-value {
    position: absolute;
    top: 0;
    right: 10px
}

.Controller1Bottom__slider-slider {
    position: relative;
    top: 10px
}

.Controller1Left {
    text-align: center
}

.Controller1Left__value {
    width: 32px;
    margin-bottom: 10px
}

.Controller1Left__slider {
    margin-top: 3px;
    margin-bottom: 5px
}

.problem-3 .Controller1Left {
    bottom: -45px !important
}

.problem-3 .Controller1Left__slider .cl-slider-with-labels-right {
    margin-right: 0
}

.problem-5 .Controller1Left__value {
    width: auto
}

.Controller3Bottom {
    margin-top: 30px;
    margin-left: 65px;
    margin-right: 5px;
    position: relative
}

.Controller3Bottom__label {
    position: absolute;
    top: 0;
    left: 10px
}

.Controller3Bottom__value {
    position: absolute;
    top: 0;
    right: 10px
}

.Controller3Bottom__slider {
    position: relative;
    top: 10px
}

.problem-3 .Controller3Bottom {
    margin-top: 10px;
    margin-left: 45px;
    margin-right: 10px
}

.problem-3 .Controller3Bottom__label {
    position: absolute;
    top: 25px;
    left: -26px
}

.problem-3 .Controller3Bottom__value {
    position: absolute;
    top: -9px;
    right: 0
}

.problem-3 .arrow-box {
    height: 20px;
    width: 205px;
    float: right;
    margin-right: 10px
}

.problem-3 .arrow-box .svg-board {
    width: 100%;
    height: 100%
}

.problem-3 .arrow-box .line {
    stroke: #000;
    stroke-width: 1px;
    fill: none;
    height: 100%;
    width: 100%
}

.Controller4Bottom {
    maring-top: 10px
}

.Controller4Bottom__slider-wrapper {
    display: inline-block;
    vertical-align: top;
    margin-top: 20px
}

.Controller4Bottom__slider {
    display: inline-block;
    width: 100px;
    margin: 5px
}

.Controller4Bottom__value {
    display: inline-block
}

.Controller4Bottom__graph {
    position: absolute;
    right: 0;
    display: inline-block;
    width: 110px;
    height: 90px
}

.vertical-label-item {
    display: block;
    float: left;
    clear: both;
    padding-left: 5px;
    text-align: center;
    width: 10px
}

.problem-4 .CL2Dtext.vertical {
    top: 71px !important
}

.Controller5Bottom {
    maring-top: 10px
}

.Controller5Bottom__slider-wrapper {
    display: inline-block;
    vertical-align: top;
    margin-top: 20px
}

.Controller5Bottom__slider {
    display: inline-block;
    width: 100px;
    margin: 5px
}

.Controller5Bottom__value {
    display: inline-block
}

.Controller5Bottom__graph {
    position: absolute;
    left: 90px;
    display: inline-block;
    width: 90px;
    height: 90px
}

.Controller5Bottom__graph-blue {
    position: absolute;
    right: 0;
    width: 90px;
    height: 90px
}

.problem-5 .CL2Dtext.vertical {
    top: 71px !important
}

.Controller2Bottom__circular {
    width: 100px;
    height: 90px;
    float: right;
    margin-right: 10px
}

.Controller2Bottom .cb {
    clear: both
}

.Controller2Bottom__slider {
    margin: 0 5px;
    width: 90%
}

.Controller2Bottom__slider-value {
    position: absolute;
    left: 17px;
    top: -10px
}

.Controller2Bottom .slider-horizontal {
    margin-left: -19px;
    position: relative
}

.Controller2Bottom .slider-horizontal>div {
    display: inline-block !important
}

.Arrows {
    height: 15px;
    padding: 0;
    margin-bottom: 5px
}

.Arrows__top {
    height: 100%;
    width: 100%
}

.Arrows__left {
    width: 15px;
    height: 190px;
    position: relative;
    left: -20px
}

.Arrows .line {
    stroke: #000;
    stroke-width: 1px;
    fill: none
}

.HintsController_1_Bottom {
    position: relative;
    font-size: 15px
}

.HintsController_1_Bottom__left {
    position: absolute;
    left: 77px;
    top: 5px;
    visibility: visible
}

.HintsController_1_Bottom__right {
    position: absolute;
    top: 5px;
    left: 222px;
    visibility: visible
}

.HintsController_1_Bottom__b {
    position: absolute;
    top: -159px;
    left: 135px;
    visibility: visible
}

.HintsController_1_Bottom__vector {
    position: absolute;
    width: 54px;
    height: 10px;
    top: 9px;
    left: 157px
}

.HintsController_1_Bottom__vector svg {
    height: 100%;
    width: 100%
}

.HintsController_1_Bottom__vector-label {
    left: 20px;
    top: 7px;
    position: absolute
}

.HintsController_1_Bottom__step-1 {
    position: absolute;
    top: -72px;
    left: 112px
}

.HintsController_1_Bottom__step-y {
    position: absolute;
    top: -72px;
    left: 204px
}

.HintsController_1_Bottom__step-func {
    position: absolute;
    top: -204px;
    left: 111px
}

.HintsController_3_Bottom {
    width: 100%;
    height: 10px;
    margin-left: 45px
}

.HintsController_3_Bottom svg {
    width: 100%;
    height: 100%
}

.HintsController_3_Bottom__x {
    position: relative;
    left: 40px
}

.HintsController_3_Bottom__y {
    position: relative;
    left: 130px
}

.RightContent {
    position: relative;
    height: 100%
}

.RightContent__hints {
    width: 100%;
    position: absolute;
    bottom: 30px
}

.RightContent__area-graph {
    height: 170px;
    position: absolute;
    bottom: 20px;
    width: 90%;
    right: 10px
}

.RightContent__graph {
    margin-left: 20px
}

.RightContent__graph-left-wrapper {
    margin-bottom: 22px;
    height: 190px;
    margin-top: 16px;
    display: inline-block
}

.RightContent__graph-left-wrapper .graph-ext-glider {
    position: absolute;
    display: none
}

.RightContent__graph-left-wrapper .graph-ext-glider.right {
    right: 0;
    top: 10px
}

.RightContent__graph-left-wrapper .graph-ext-glider.bottom {
    top: 213px;
    left: 60px
}

.RightContent__graph-left {
    display: inline-block;
    min-width: 10%;
    height: 190px;
    vertical-align: top;
    position: relative
}

.RightContent__graph-right {
    display: none
}

.RightContent__graph-graph {
    height: 190px;
    display: inline-block;
    width: 205px;
    vertical-align: top;
    position: absolute;
    right: 10px;
    top: 21px
}

.problem-1 .RightContent__area-graph {
    width: 205px;
    height: 170px
}

.problem-1 .Controller1Left__value {
    min-width: 37px
}

.problem-6 .Controller1Left {
    top: 36px
}

.problem-2 .RightContent__graph-graph {
    top: 16px;
    right: 10px
}

.problem-2 .RightContent__graph-left-wrapper {
    height: 187px
}

.problem-2 .RightContent__area-graph {
    height: 120px
}

.problem-2 .AreaGraph__button {
    height: 16%
}

.problem-3 .RightContent__area-graph {
    width: 205px
}

.problem-3 .RightContent .graph-ext-glider {
    display: block
}

.problem-4 .RightContent__area-graph {
    width: 230px
}

.problem-4 .AreaGraph__value {
    left: 126px
}

.problem-5 .RightContent__area-graph {
    width: 230px
}

.problem-5 .AreaGraph__button {
    width: 85%
}

.Graph,
.Graph__graph {
    height: 100%
}

.problem-2 .Controller2Bottom .Graph__graph {
    border: 1px solid #999
}

.Hints__text {
    margin: 0;
    margin-bottom: 10px;
    min-height: 100px;
    outline: none
}

.Hints__buttons {
    text-align: right
}

.AreaGraph {
    position: relative
}

.AreaGraph,
.AreaGraph__graph {
    width: 100%;
    height: 100%
}

.AreaGraph__value {
    position: absolute;
    top: 4px;
    left: 8px;
    font-size: 14px
}

.AreaGraph__button {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 60%;
    height: 13%
}